<!DOCTYPE html>
<html>

<head lang="en">
	<title>骡窝日报</title>
	<meta charset="utf-8" />
	<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
	<link rel="stylesheet" href="/js/plugins/bootstrap-4.1.1-dist/css/bootstrap.min.css">
	<script src="/js/plugins/jquery/jquery.min.js"></script>
	<script src="/js/plugins/bootstrap-4.1.1-dist/js/bootstrap.min.js"></script>
	<link rel="stylesheet" href="/css/font/css/font-awesome.min.css" />
	<link rel="stylesheet" href="/css/reset.css" />
	<link rel="stylesheet" href="/css/news.css" />
	<script src="/js/plugins/jrender/jrender.min.js"></script>
	<link rel="stylesheet" href="/js/plugins/jquery-confirm/css/jquery-confirm.css">
	<script src="/js/plugins/jquery-confirm/js/jquery-confirm.js"></script>
	<script src="/js/common.js"></script>
	<link rel="stylesheet" href="/js/plugins/dialog2/css/dialog.css">
	<script src="/js/plugins/dialog2/js/dialog.min.js"></script>

	<script>
        $(function () {
            $.get('/news/many',{state:1, pageSize:8}, function (data) {
                console.log(data);
                $("#news").renderValues(data)

                $("a[data-url]").click(function () {
                    var url = $(this).data("url")
                    var id = $(this).data("nid")
                    window.location.href = url + id;
                })
            })

            var user = JSON.parse(sessionStorage.getItem("user"))
            var currentPage = $("#currentPage");
            var pageSize = $("#pageSize");
            var pages = 1;
            var allData = [];
            var keyword = "";
            $(".search").change(function () {
                keyword = $(".search input").val();
                allData = [];
                $("#currentPage").val(1);
                query();
            });
            function query() {
                var currentPageValue = currentPage.val()
                var pageSizeValue = pageSize.val()
                $.post("/news/many", {currentPage: currentPageValue, pageSize: pageSizeValue,keyword:keyword}, function (data) {
                    console.log(data.list);
                    $.merge(allData, data.list)
                    $("#news").renderValues({list: allData});
                    console.log(allData);
                    currentPage.val(parseInt(currentPageValue) + 1);
                    pages = data.pages;

                    $("a[data-url]").click(function () {
                        var url = $(this).data("url")
                        var id = $(this).data("id")
                        window.location.href = url + id;
                    })
                })
            }

            query();



            //翻页
            $(window).scroll(function () {
                console.log($(document).scrollTop());
                console.log($(window).height());
                console.log($(document).height());
                if ($(document).scrollTop() + $(window).height() + 5 >= $(document).height()) {

                    var currentPageValue = currentPage.val()
                    if (currentPageValue <= pages) {
                        query();
                    } else {
                        $(document).dialog({
                            type: 'notice',
                            infoText: '人家是有底线的人!',
                            autoClose: 1500
                        });
                    }
                }
            })
        })
	</script>

</head>

<body>
<input type="hidden" name="currentPage" id="currentPage" value="1">
<input type="hidden" name="pageSize" id="pageSize" value="8">
<div class="search-head">
	<div class="row nav-search">
		<div class="col-2">
			<a href="index.html">
				<span><i class="fa fa-chevron-left fa-2x"></i></span>
			</a>
		</div>
		<div class="col-10">
			<div class="input-group-sm search">
				<input class="form-control searchBtn"  placeholder="搜索资讯">
			</div>
		</div>
	</div>
</div>

<div class="container news" id="news">
	<div class="news" >
		<h6 class="news-title">骡窝日报 </h6>
		<div class="row" render-loop="list">
			<div class="col-6">

				<a href="javascript:;" data-url="/newsContent.html?id=" render-attr="data-id=list.id">

					<img class="rounded" width="100%" height="110px"  render-src="list.coverUrl">
				</a>
				<div class="caption">
					<p>
						<span > </span>
						<!--<i class="fa fa-heart-o"></i>-->
					</p>

					<a href="javascript:;" data-url="/newsContent.html?id=" render-attr="data-id=list.id">
						<p render-html="list.releaseTime"></p>
						<p render-html="list.title"></p>
					</a>
				</div>
			</div>

		</div>
	</div>
</div>

</body>
</html>